<!--
* @author wn
* @date 2023/03/07 16:02:14
* @description: Ant D 单文件递归菜单
!-->
<template>
	<a-sub-menu :key="menuInfo.path">
		<template #icon v-if="icon2To3(menuInfo.meta?.icon)">
			<Icon :icon="icon2To3(menuInfo.meta?.icon)" />
		</template>
		<template #title>{{ menuInfo.meta?.title }}</template>
		<template v-for="item in menuInfo.children" :key="item.id">
			<!-- 没有子 menu -->
			<template v-if="!item.children">
				<a-menu-item :key="item.path">
					<template #icon v-if="icon2To3(item.meta?.icon)">
						<Icon :icon="icon2To3(item.meta?.icon)" />
					</template>
					{{ item.meta?.title }}
				</a-menu-item>
			</template>
			<!-- 有子 menu vue组件自己调用自己  递归 :key="item.id"-->
			<template v-else>
				<sub-menu :menu-info="item" />
			</template>
		</template>
	</a-sub-menu>
</template>
<script setup>
import { Icon } from '@/antd/icons'
import { icon2To3 } from '@/utils/iconMap'

defineProps({
	menuInfo: {
		type: Object,
		default: () => ({}),
	},
})
</script>
<style scoped lang="less"></style>
